<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
<style type="text/css">
.selectbox
{
border: 1px solid #C0C0C0;
width: 77px;
height: 16px;
clip: rect( 0px, 60px,16px, 0px );
overflow: hidden;
}
.selectbox2
{
position: relative;
border: 1px solid #F4F4F4;
width: 76px;
height: 15px;
clip: rect( 0px, 80px, 15px, 0px );
overflow: hidden;
}
select
{
position: relative;
left: -2px;
top: -2px;
width:97px;
line-height: 15px; color: #909993;
background-image:url(../images/selectIcon.gif);//添加背景图标，替代倒三角
 background-repeat: no-repeat;
  background-position:95px 25px;
border-style: none;
border-width: 0px;
}
select option.hover{
	background-color:red;
}
</style>
</head>
<body>
<div class = selectbox>
<div class = selectbox2>
<select size = "1" name = "D1">
<option>--css修改select样式</option>
<option>网站编程</option>
<option>网站编程</option>
<option>网站编程</option>
<option>网站编程</option>
</select>
</div>
</div>
</body>
</html>
